<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul id="ul1">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>
<ul id="ul2">
    <li>4</li>
    <li>5</li>
    <li>6</li>
</ul>
<div id="div1"> 123 abc</div>
<div id="div2"><span></span></div>
<script>
    let ul1 = document.querySelector("#ul1");
    let ul2 = document.querySelector("#ul2");
    let li = document.querySelector("li");
    /*此处省略1000行*/
    console.log(ul1.contains(li));
    console.log(ul2.contains(li));
    // hasChildNodes()：是否有子节点
    console.log(document.querySelector("#div1").hasChildNodes())
    console.log(document.querySelector("#div2").hasChildNodes())
    // 判断是否有子元素
    console.log(document.querySelector("#div2").firstElementChild !== null);
    let ul3 = ul1.cloneNode(false); // 浅拷贝
    console.log(ul1.firstElementChild);
    console.log(ul3);
    console.log(ul1.firstElementChild === ul3.firstElementChild); // false
    // document.body.appendChild(ul3);
    let ul4 = ul1.cloneNode(true);
    console.log(ul4);
    console.log(ul1 === ul4); // false

    /*
    cloneNode(deep?: boolean): Node;
        false：只复制标签本身，但不会复制里面的后代元素
        true：复制标签本身，且复制里面的后代元素
     */

    let div1 = document.querySelector("#div1");
    console.log(div1.childNodes.length);
    let textNode = document.createTextNode("这是JS创建的文本节点");
    div1.appendChild(textNode);
    console.log(div1.childNodes.length);
    div1.normalize();// 将所有文本节点调整为1个
    console.log(div1.childNodes.length);
</script>
</body>
</html>